<template>
  <div class="pages">
    <div class="pageLevel" v-if="!sub">
      <el-form :model="formData" :rules="rules" ref="formData" label-width="120px" size="small">
        <div class="infon">
          <div class="infon_text">
            <span class="infon_shu"></span>
            <span class="infon_text_t"> 基础信息</span>
          </div>
        </div>
        <el-form-item label="活动名称" prop="activityName">
          <el-input style="width:250px;" v-model="formData.activityName" maxlength="15" :disabled="!canSave"></el-input>
        </el-form-item>
        <el-form-item label="活动时间" prop="dateRange">
          <el-date-picker :disabled="!canSave" v-model="formData.dateRange" value-format="yyyy-MM-dd HH:mm:ss" :clearable='false' format="yyyy-MM-dd HH:mm:ss" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
        </el-form-item>

        <el-form-item label="使用门店" prop="shopList">
          <el-button type="primary" @click="clickSelectStores()" plain :disabled="!canSave">选择门店</el-button>
        </el-form-item>
        <el-form-item label="">
          <el-table max-height="250" :data="formData.shopList" style="width: 80%">
            <el-table-column prop="name" align="center" label="门店名称"> </el-table-column>
            <el-table-column prop="shopType" align="center" label="类型" :formatter="shopType"></el-table-column>
            <el-table-column align="center" label="操作">
              <template slot-scope="scope">
                <el-button type="text" @click="deleteStore(scope.$index, formData.shopList)" :disabled="!canSave">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>

        <div class="infon">
          <div class="infon_text">
            <span class="infon_shu"></span>
            <span class="infon_text_t"> 选择优惠券</span>
            <i class="el-icon-question" v-on:click="showTips=!showTips"></i>
            <span class="ts" v-show="showTips">拉新活动的券直接发放到会员卡包，无需领取</span>
          </div>
        </div>
        <el-form-item label="优惠券" prop="ticketList">
          <el-button type="primary" @click="clickSelectTickets()" plain :disabled="!canSave">选择优惠券</el-button>
        </el-form-item>
        <el-form-item>
          <el-table max-height="250" :data="formData.ticketList" style="width: 80%">
            <el-table-column prop="ticketType" :formatter="ticketType" align="center" width="100" label="优惠券类型"> </el-table-column>
            <el-table-column prop="ticketName" align="center" label="优惠券标题" width="100"></el-table-column>
            <el-table-column prop="ticketSubName" align="center" label="优惠券副标题" width="120"></el-table-column>
            <el-table-column prop="sendCount" align="center" label="发放数量">
              <template slot-scope="scope">
                <el-input v-show="canSave" v-model="scope.row.sendCount"></el-input>
                <span v-show="!canSave">{{scope.row.sendCount}}</span>
              </template>
            </el-table-column>
            <el-table-column prop="validDay" align="center" label="有效期"></el-table-column>
            <el-table-column prop="createTime" align="center" label="创建时间"></el-table-column>
            <el-table-column align="center" label="操作">
              <template slot-scope="scope">
                <el-button type="text" @click="deleteTicket(scope.$index, formData.ticketList)" :disabled="!canSave">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>

        <div class="infon">
          <div class="infon_text">
            <span class="infon_shu"></span>
            <span class="infon_text_t">活动规则</span>
          </div>
        </div>
        <el-form-item label="活动人群" prop="activityCrowd" class="activityPeople">
          <el-radio-group @change="changePeopleRange" v-model="formData.activityCrowd" :disabled="!canSave">
            <el-radio label="0">全部会员</el-radio><br>
            <el-radio label="2">会员等级</el-radio><br>
            <div v-show="memLevel" class="memLevelContent">
              <el-checkbox-group v-model="levelL">
                <el-checkbox v-for="item in memberList" :key="item.id" :label="item.id">{{item.levelName}}</el-checkbox>
              </el-checkbox-group>
            </div>
            <el-radio label="3">自定义会员</el-radio>
            <!-- 选择自定义会员 -->
            <div v-show="diymem" class="memLevelContent">
              <el-form inline size="mini" :model="formData" label-width="100px">
                <el-row>
                  <el-form-item label="订单时间" prop="orderDate">
                    <el-date-picker v-model="formData.orderDate" value-format="yyyy-MM-dd" format="yyyy-MM-dd" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :disabled="!canSave"></el-date-picker>
                  </el-form-item>
                  <el-form-item label="消费次数" prop="payNum">
                    <el-input v-model="formData.payNum" :disabled="!canSave"></el-input>
                  </el-form-item>
                </el-row>
                <el-row>
                  <el-form-item label="订单金额" prop="moneyMin">
                    <el-input v-model="formData.moneyMin" :disabled="!canSave"></el-input>
                  </el-form-item>
                  <el-form-item label="" label-width="0">
                    <span>----</span>
                  </el-form-item>
                  <el-form-item label-width="0" prop="moneyMax">
                    <el-input v-model="formData.moneyMax" :disabled="!canSave"></el-input>
                  </el-form-item>
                </el-row>
                <el-row>
                  <el-form-item label="购买品类">
                    <el-select v-model="formData.typeId" placeholder="请选择" :disabled="!canSave" clearable>
                      <el-option v-for="item in commodityCategoryfunList" :key="item.id" :label="item.label" :value="item.id"></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="购买品牌">
                    <el-select v-model="formData.brandId" placeholder="请选择" :disabled="!canSave" clearable>
                      <el-option v-for="item in commodityBrandList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                    </el-select>
                  </el-form-item>
                </el-row>
                <el-form-item label="">
                  <el-button type="primary" @click="getMemNum" :disabled="!canSave">筛选</el-button>
                </el-form-item>
                <el-form-item label="">
                  <el-button @click="resetman" :disabled="!canSave">重置</el-button>
                </el-form-item>
                <el-form-item label="统计" label-width="50px">
                  <el-input disabled v-model="statisticsNum"></el-input>
                </el-form-item>
              </el-form>
            </div>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="每人最多参与" prop="maxTimes">
          <el-input style="width:100px;margin-right:10px;" v-model="formData.maxTimes" :disabled="!canSave"></el-input><span>次</span>
        </el-form-item>
        <el-form-item label="领取规则" prop="receiveType">
          <el-radio v-model="formData.receiveType" label="1" :disabled="!canSave">卖家发放</el-radio>
        </el-form-item>
        <el-form-item label="投放渠道" prop="putChannel">
          <el-checkbox-group v-model="formData.putChannel" @change="handleH5check" :disabled="!canSave">
            <el-checkbox label="0" value='1'>婴联帮店铺首页</el-checkbox><br>
            <el-checkbox label="1" value='2'>短信链接h5页面</el-checkbox>
          </el-checkbox-group>
          <div v-if="isH5Page" label="短信链接H5页面:">
            <el-form :model="formData" inline size="mini">
              <el-form-item>
                <el-input style="width:100px;" disabled v-model="formData.H5title"></el-input>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" @click="clickSelectH5Page()" :disabled="!canSave">选择H5页面</el-button>
              </el-form-item>
            </el-form>
          </div>
        </el-form-item>
        <el-form-item label="">
          <span class="pltext">(婴联帮店铺首页仅适用婴联帮公司使用。选择婴联帮店铺首页，活动审核通过后直接注券到婴联帮APP的门店首页，不勾选则不注券到APP； 选择短信链接H5页面，活动审核通过后直接注券到H5页面，然后领取使用，不勾选则不发送短信）</span>
        </el-form-item>

        <!-- 短信模板 -->
        <div class="infon">
          <div class="infon_text">
            <span class="infon_shu"></span>
            <span class="infon_text_t"> 消息模板</span>
          </div>
        </div>
        <el-form-item label="" label-width="30px">
          <el-input style="width:150px;margin-right:10px;" disabled v-model="formData.msgTemplateId"></el-input>
          <el-button :disabled="formData.id=='' || formData.id==undefined || !canSave" type="primary" @click="clickSelectMsg()">选择短信模板</el-button>
        </el-form-item>

        <el-form-item label="">
          <el-button v-if="canSave" type="primary" @click="saveAct('0','formData')">保存</el-button>
          <el-button v-if="canSave" type="primary" @click="saveAct('1','formData')">保存并提交审核</el-button>
        </el-form-item>
      </el-form>

      <!-- 门店弹窗 -->
      <el-dialog title="选择门店" :visible.sync="dialogStore" :closeOnClickModal='false' :closeOnPressEscape='false'>
        <div class="tableSearch">
          <el-form size="mini" label-width="50px">
            <el-row>
              <el-form-item label="区域">
                <el-input v-model="selectData.storeName" placeholder="请输入门店名称"></el-input>
              </el-form-item>
              <el-form-item label="类型">
                <el-select v-model="selectData.storeType" placeholder="请选择">
                  <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="" label-width="10px">
                <el-button type="primary" @click="searchStore()">查询</el-button>
              </el-form-item>
              <el-form-item label="" label-width="10px">
                <el-button @click="resetStore()">重置</el-button>
              </el-form-item>
            </el-row>
            <el-row>
              <el-form-item label="" label-width="10px">
                <el-button type="primary" @click="confirmSelectStore()">选择</el-button>
              </el-form-item>
              <el-form-item label="" label-width="10px">
                <el-button @click="dialogStore=false">取消</el-button>
              </el-form-item>
            </el-row>
          </el-form>
        </div>
        <el-table :data="tableDataDialogStore" height="300" ref="multipleTableStore" tooltip-effect="dark" highlight-current-row @selection-change="selectStore" :row-key="getRowKeysStore">
          <el-table-column type="selection" width="50" :reserve-selection="true"></el-table-column>
          <el-table-column prop="name" label="门店名称" align="center"></el-table-column>
          <el-table-column prop="shopType" :formatter="shopType" align="center" label="类型"></el-table-column>
        </el-table>
        <page-unit :pageData="pageDataStore" :func="getStore"></page-unit>
      </el-dialog>

      <!-- 优惠券弹窗 -->
      <el-dialog title="选择优惠券" :visible.sync="dialogTicket" :closeOnClickModal='false' :closeOnPressEscape='false'>
        <div class="tableSearch">
          <el-form size="mini">
            <el-row>
              <el-form-item label="优惠券名称" label-width="100px">
                <el-input v-model="selectData.ticketName" placeholder="请输入优惠券名称"></el-input>
              </el-form-item>
              <el-form-item label="" label-width="10px">
                <el-button type="primary" @click="searchTicket()">查询</el-button>
              </el-form-item>
            </el-row>
            <el-row>
              <el-form-item label="" label-width="10px">
                <el-button type="primary" @click="confirmSelectTicket()">选择</el-button>
              </el-form-item>
              <el-form-item label="" label-width="10px">
                <el-button @click="dialogTicket=false">取消</el-button>
              </el-form-item>
            </el-row>
          </el-form>
        </div>
        <el-table :data="tableDataDialogTicket" height="300" ref="multipleTableTicket" tooltip-effect="dark" highlight-current-row @selection-change="selectTicket" :row-key="getRowKeysTicket">
          <el-table-column type="selection" width="50" :reserve-selection="true"></el-table-column>
          <el-table-column prop="ticketName" label="优惠券标题" align="center"></el-table-column>
          <el-table-column prop="ticketSubName" label="优惠券副标题" align="center"></el-table-column>
          <el-table-column prop="ticketType" :formatter="ticketType" align="center" label="优惠券类型"></el-table-column>
          <el-table-column prop="validDay" label="有效期时间" align="center"></el-table-column>
          <el-table-column prop="ticketState" :formatter="cardStutas" label="状态" align="center"></el-table-column>
          <el-table-column prop="createTime" label="创建时间" align="center"></el-table-column>
        </el-table>
        <page-unit :pageData="pageDataTicket" :func="getCard"></page-unit>
      </el-dialog>

      <!-- 选择短信模板弹窗 -->
      <el-dialog title="选择短信模板" :visible.sync="dialogMsg" :closeOnClickModal='false' :closeOnPressEscape='false' width="50%">
        <div class="tableSearch">
          <el-form size="mini">
            <el-row>
              <el-form-item label="code" label-width="55px">
                <el-input v-model="selectData.msgCode" placeholder="请输入code"></el-input>
              </el-form-item>
              <el-form-item label="" label-width="10px">
                <el-button type="primary" @click="searchMsg()">查询</el-button>
              </el-form-item>
            </el-row>
            <el-row>
              <el-form-item label="" label-width="10px">
                <el-button type="primary" @click="confirmSelectMsg()">选择</el-button>
              </el-form-item>
              <el-form-item label="" label-width="10px">
                <el-button @click="dialogMsg=false">取消</el-button>
              </el-form-item>
            </el-row>
          </el-form>
        </div>
        <el-table :data="tableDataDialogMsg" height="300" ref="multipleTableMsg" tooltip-effect="dark" highlight-current-row @current-change="selectMsg">
          <el-table-column prop="msgCode" label="code" align="center"></el-table-column>
          <el-table-column prop="msgContent" label="内容" align="center"></el-table-column>
        </el-table>
        <page-unit :pageData="pageDataMsg" :func="getMsg"></page-unit>
      </el-dialog>

      <!-- H5页面弹窗 -->
      <el-dialog title="选择H5页面" :visible.sync="dialogH5Page" :closeOnClickModal='false' :closeOnPressEscape='false' width="50%">
        <div class="tableSearch">
          <el-form size="mini">
            <el-row>
              <el-form-item label="" label-width="10px">
                <el-button type="primary" @click="confirmSelectH5Page()">选择</el-button>
              </el-form-item>
              <el-form-item label="" label-width="10px">
                <el-button @click="dialogH5Page=false">取消</el-button>
              </el-form-item>
            </el-row>
          </el-form>
        </div>
        <el-table :data="tableDataDialogH5Page" height="300" ref="multipleTableH5Page" tooltip-effect="dark" highlight-current-row @current-change="selectH5Page">
          <el-table-column type="index" label="序号" align="center"></el-table-column>
          <el-table-column prop="title" label="标题" align="center"></el-table-column>
        </el-table>
        <page-unit :pageData="pageDataH5Page" :func="h5ConfigList"></page-unit>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import { mapState } from "vuex";
import pageUnit from "@/components/Page";
import util from "@/util";
import state from "@/util/state";
import {
  saveOrUpdateActivity,
  updateActivity,
  listMemberLevelOfTicket,
  ticketSendCountMember,
  findMsgTemplateListPage,
  selectH5List,
  findMarketTicketListPage,
  getActivityDetail,
  selectBaseShopPageList,
  getGoodsLabelList,
  getTreeList
} from "@/api";
export default {
  components: { pageUnit },
  computed: mapState([
    "pageLevel",
    "merchantId",
    "sub",
    "userInfo",
    "isShop",
    "linkName"
  ]),
  data() {
    return {
      getRowKeysStore(row) {
        return row.id;
      },
      getRowKeysTicket(row) {
        return row.id;
      },
      shopType: state.shopType,
      ticketType: state.ticketType,
      cardStutas: state.cardStutas,
      canSave: false, // 是否显示保存按钮
      levelL: [], // 选择的会员等级
      showTips: false, // 是否显示优惠券提示
      isH5Page: false, // 是否选择短信链接H5页面
      commodityBrandList: [], // 自定义会员购买品牌数组
      commodityCategoryfunList: [], // 自定义会员购买品类数组
      tableDataDialogTicket: [], // 弹窗优惠券数组
      tableDataDialogStore: [], // 弹窗门店数组
      tableDataDialogMsg: [], // 弹窗短信数组
      tableDataDialogH5Page: [], // 弹窗H5页面数组
      dialogTicket: false, // 优惠券弹窗
      dialogStore: false, // 门店弹窗
      dialogMsg: false, // 短信弹窗
      dialogH5Page: false, // h5配置弹窗
      mutableStore: [], // 多选选择门店存入的数组
      mutableTicket: [], // 多选选择优惠券存入的数组
      singleMsg: "", // 单选短信数组
      singleH5Page: "", // 单选H5页面数组
      memLevel: false, // 是否显示会员等级
      diymem: false, // 是否显示自定义会员表单
      memberList: [], // 会员等级数组
      statisticsNum: 0,
      formData: {
        orgId: "", //组织结构id
        activityName: "", //活动名称
        activityType: "1", //活动类型，0-会员拉新，1-会员关怀
        dateRange: [], // 活动时间
        activityStartTime: "", //活动开始时间
        activityEndTime: "", //活动结束时间
        activityCreater: "", //活动创建人
        activityAuditState: "", //活动审核状态，0-已保存 1-待审核，2-审核通过，3-审核驳回，4-已撤回;
        activityState: "", //活动状态，0-未开始，1-已开始，2-已结束
        activityCrowd: "", //活动人群，0-全部会员，1-注册会员，2-会员等级，3-自定义会员
        activityCrowdRue: [], //自定义会员
        timeStart: "", //优惠券开始时间
        timeEnd: "", //优惠券结束时间
        payNum: "", //消费次数
        moneyMin: "", //客单价（最小值）
        moneyMax: "", //客单价（this.最大值）
        typeId: "", //品类id
        brandId: "", //品牌id
        peopleNum: 0, // 自定义统计会员
        maxTimes: "", //最大参与次数
        putChannel: [], //投放渠道 0-婴联帮店铺首页 1-短信链接H5页面
        urlId: "", //h5链接地址
        receiveType: "1", //领取规则：0-买家领取，1-卖家发放
        msgTemplateId: "", //短信模版Id
        msgTemplateName: "", //短信模板内容
        H5title: "",
        shopList: [],
        ticketList: [],
        orderDate: []
      },
      rules: {
        activityName: [
          { required: true, message: "请输入活动名称", trigger: "blur" },
          { min: 1, max: 25, message: "长度在 1 到 25 个字符", trigger: "blur" }
        ],
        dateRange: [
          { required: true, message: "请选择活动日期", trigger: "blur" }
        ],
        shopList: [{ required: true, message: "请选择门店", trigger: "blur" }],
        ticketList: [
          { required: true, message: "请选择优惠券", trigger: "blur" }
        ],
        activityCrowd: [
          {
            required: true,
            message: "请至少选择一类活动人群",
            trigger: "change"
          }
        ],
        payNum: [{ validator: util.validateParkingLot, trigger: "blur" }],
        maxTimes: [
          { required: true, message: "每人最多参与次数", trigger: "blur" },
          { validator: util.validatenum1, trigger: "blur" }
        ],
        moneyMin: [{ validator: util.validatenum1, trigger: "blur" }],
        moneyMax: [{ validator: util.validateParkingLot, trigger: "blur" }],
        putChannel: [
          {
            type: "array",
            required: true,
            message: "请至少选择一个投放渠道",
            trigger: "change"
          }
        ]
      },
      options: [
        // 门店类型
        { value: "", label: "全部" },
        { value: "0", label: "直营店" },
        { value: "1", label: "加盟店" }
      ],
      pageDataTicket: {
        pageSize: 5,
        currentPage: 1,
        totalItems: 0,
        pageSizeArr: [5, 10, 20]
      },
      pageDataStore: {
        pageSize: 5,
        currentPage: 1,
        totalItems: 0,
        pageSizeArr: [5, 10, 20]
      },
      pageDataMsg: {
        pageSize: 5,
        currentPage: 1,
        totalItems: 0,
        pageSizeArr: [5, 10, 20]
      },
      pageDataH5Page: {
        pageSize: 5,
        currentPage: 1,
        totalItems: 0,
        pageSizeArr: [5, 10, 20]
      },
      selectData: {
        storeName: "", // 门店名称
        storeType: "", // 门店类型
        ticketName: "", // 优惠券关键字
        msgCode: "" // 短信code
      }
    };
  },
  watch: {
    statisticsNum(value) {
      this.formData.peopleNum = value;
    }
  },
  mounted() {
    let id = util.getQuery().id;
    if (util.getQuery().id == null) {
      // 新增
      this.canSave = true;
    } else {
      if (Number(util.getQuery().showTab) === 0) {
        // 查看
        this.canSave = false;
        this.details();
      } else if (Number(util.getQuery().showTab) === 1) {
        // 编辑
        this.canSave = true;
        this.details();
      }
    }
    this.getMemberLevel();
    this.commodityCategoryfun();
    this.commodityBrand();
  },
  methods: {
    // 查询门店
    getStore(pageSize, pageNum) {
      let data = {
        nameOrCode: this.selectData.storeName,
        shopType: this.selectData.storeType,
        pageNum: pageNum,
        pageSize: pageSize,
        openAccount: "", // 是否开户，0-否，1-是
        businessId: this.merchantId,
        type: 3 //1供应商（查找客户） 2-客户（查找供应商） 3-连锁（查客户）
      };
      selectBaseShopPageList(data).then(res => {
        if (res.code == 200) {
          this.tableDataDialogStore = res.data.list;
          this.pageDataStore.totalItems = res.data.pageTotal;
        }
      });
    },
    // 查询可用优惠券体验券
    getCard(pageSize, pageNum) {
      let data = {
        pageSize: pageSize,
        pageNo: pageNum,
        orgId: this.merchantId,
        activityStartTime: this.formData.dateRange[0],
        activityEndTime: this.formData.dateRange[1],
        ticketTypeList: "0,1",
        ticketState: 0,
        ticketName: this.selectData.ticketName
      };
      findMarketTicketListPage(data).then(res => {
        if (res.code == 200) {
          res.data.list.forEach(element => {
            element.sendCount = "";
          });
          this.tableDataDialogTicket = res.data.list;
          this.pageDataTicket.totalItems = res.data.totalPage;
        }
      });
    },
    // h5配置列表查询
    h5ConfigList(pageSize, pageNum) {
      let Data = {
        pageSize: pageSize,
        pageNum: pageNum,
        companyId: this.merchantId
      };
      selectH5List(Data).then(res => {
        if (res.code == 200) {
          this.tableDataDialogH5Page = res.data.list;
          this.pageDataH5Page.totalItems = res.data.pageTotal;
        }
      });
    },
    // 查询短信模板
    getMsg() {
      let Datas = {
        pageSize: 10,
        pageNum: 1,
        msgCode: this.selectData.msgCode,
        orgId: this.merchantId
      };
      findMsgTemplateListPage(Datas).then(res => {
        if (res.code == 200) {
          this.tableDataDialogMsg = res.data.list;
          this.pageDataMsg.totalItems = res.data.totalPage;
        }
      });
    },
    // 自定义会员选择商品品类
    commodityCategoryfun() {
      getTreeList({}).then(res => {
        if (res.code == 200) {
          this.commodityCategoryfunList = res.data;
        }
      });
    },
    // 自定义会员选择商品品牌
    commodityBrand() {
      let data = {
        pageSize: 20,
        pageNo: 1,
        labelType: 0,
        shopId: this.merchantId
      };
      getGoodsLabelList(data).then(res => {
        if (res.code == 200) {
          this.commodityBrandList = res.data.list;
        }
      });
    },
    //查询会员等级
    getMemberLevel() {
      let data = {
        shopId: this.merchantId,
        isCompany: false
      };
      listMemberLevelOfTicket(data).then(res => {
        if (res.code == 200) {
          this.memberList = res.data.list;
        }
      });
    },
    // 筛选可用自定义会员
    getMemNum() {
      if (Number(this.formData.moneyMin) > Number(this.formData.moneyMax)) {
        this.$message.error("自定义会员消费最低金额不能大于最高金额！");
        return false;
      }
      let data = {
        startDate: this.formData.orderDate[0],
        endDate: this.formData.orderDate[1],
        saleNum: this.formData.payNum,
        orderPriceMin: this.formData.moneyMin,
        orderPriceMax: this.formData.moneyMax,
        classifyId: this.formData.typeId,
        brandId: this.formData.brandId,
        shopId: this.merchantId
      };
      ticketSendCountMember(data).then(res => {
        if (res.code == 200) {
          this.statisticsNum = Number(res.data.count);
          this.formData.peopleNum = Number(res.data.count);
        }
      });
    },
    // 删除一条选择的优惠券
    deleteTicket(index, rows) {
      rows.splice(index, 1);
    },
    // 删除一条选择的门店
    deleteStore(index, rows) {
      rows.splice(index, 1);
    },
    // 点击选择门店
    clickSelectStores() {
      this.getStore(this.pageDataStore.pageSize, 1);
      this.dialogStore = true;
    },
    // 点击选择优惠券
    clickSelectTickets() {
      if (this.formData.dateRange[0] == null) {
        this.$message.warning("请选择活动时间");
        return false;
      } else {
        this.getCard(this.pageDataTicket.pageSize, 1);
        this.dialogTicket = true;
      }
    },
    // 点击选择短信模板
    clickSelectMsg() {
      this.getMsg(this.pageDataMsg.pageSize, 1);
      this.dialogMsg = true;
    },
    // 点击选择h5配置模板
    clickSelectH5Page() {
      this.h5ConfigList(this.pageDataH5Page.pageSize, 1);
      this.dialogH5Page = true;
    },
    // 弹窗中门店多选
    selectStore(val) {
      this.mutableStore = val;
    },
    // 弹窗多选优惠券
    selectTicket(val) {
      this.mutableTicket = val;
    },
    // 弹窗短信单选
    selectMsg(val) {
      this.singleMsg = val;
    },
    // 弹窗h5页面单选
    selectH5Page(val) {
      this.singleH5Page = val;
    },
    // 弹窗门店里面的查询
    searchStore() {
      this.getStore(this.pageDataStore.pageSize, 1);
    },
    searchTicket() {
      this.getCard(this.pageDataTicket.pageSize, 1);
    },
    searchMsg() {
      this.getMsg(this.pageDataMsg.pageSize, 1);
    },
    // 弹窗门店查询的重置
    resetStore() {
      this.selectData.storeName = "";
      this.selectData.storeType = "";
    },
    // 弹窗里确定选择门店弹窗
    confirmSelectStore() {
      if (this.mutableStore.length === 0) {
        this.$message.error("请先选择门店");
        return false;
      }
      this.formData.shopList = this.formData.shopList.concat(this.mutableStore);
      for (let i = 0; i < this.formData.shopList.length - 1; i++) {
        for (let j = i + 1; j < this.formData.shopList.length; j++) {
          if (this.formData.shopList[i].id == this.formData.shopList[j].id) {
            this.formData.shopList.splice(j, 1);
          }
        }
      }
      this.$refs.multipleTableStore.clearSelection();
      this.dialogStore = false;
    },
    // 弹窗确定选择优惠券
    confirmSelectTicket() {
      if (this.mutableTicket.length === 0) {
        this.$message.error("请先选择优惠券");
        return false;
      }
      this.formData.ticketList = this.formData.ticketList.concat(
        this.mutableTicket
      );
      for (let i = 0; i < this.formData.ticketList.length - 1; i++) {
        for (let j = i + 1; j < this.formData.ticketList.length; j++) {
          if (
            this.formData.ticketList[i].id == this.formData.ticketList[j].id
          ) {
            this.formData.ticketList.splice(j, 1);
          }
        }
      }
      this.$refs.multipleTableTicket.clearSelection();
      this.dialogTicket = false;
    },
    // 弹窗确定选择短信
    confirmSelectMsg() {
      this.formData.msgTemplateId = this.singleMsg.msgCode;
      this.formData.msgTemplateName = this.singleMsg.msgContent;
      this.dialogMsg = false;
    },
    // 弹窗确定选择H5页面
    confirmSelectH5Page() {
      this.formData.H5title = this.singleH5Page.title;
      this.formData.urlId = this.singleH5Page.id;
      this.dialogH5Page = false;
    },
    // 重置自定义会员条件
    resetman() {
      this.formData.orderDate = [];
      this.formData.payNum = "";
      this.formData.moneyMin = "";
      this.formData.moneyMax = "";
      this.formData.moneyMin = "";
      this.formData.typeId = "";
      this.formData.brandId = "";
      this.formData.peopleNum = 0;
      this.statisticsNum = 0;
    },
    // 选择活动人群
    changePeopleRange() {
      if (this.formData.activityCrowd == "2") {
        this.memLevel = true;
      } else {
        this.memLevel = false;
      }
      if (this.formData.activityCrowd == "3") {
        this.diymem = true;
      } else {
        this.diymem = false;
      }
    },
    // 选择投放渠道
    handleH5check() {
      if (this.formData.putChannel.indexOf("1") !== -1) {
        this.isH5Page = true;
      } else {
        this.isH5Page = false;
      }
    },
    //保存关怀活动
    saveAct(status, formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          let Datas = {};
          let dateStart = new Date(this.formData.dateRange[0]).getTime();
          let dateEnd = new Date(this.formData.dateRange[1]).getTime();
          let dateCur = new Date().getTime();
          if (dateCur > dateEnd) {
            // 当前时间大于活动结束时间
            this.$message.error("活动结束时间不能小于当前时间！");
            return false;
          }
          if (this.formData.putChannel.indexOf("1") === -1) {
            this.formData.H5title = "";
            this.formData.urlId = "";
          } else {
            if (this.formData.H5title == null || this.formData.H5title == "") {
              this.$message.error("请选择H5页面");
              return false;
            }
          }
          Datas.orgId = this.merchantId;
          Datas.activityName = this.formData.activityName;
          Datas.activityAuditState = status; // 活动审核状态，0-已保存 1-待审核，2-审核通过，3-审核驳回，4-已撤回;
          Datas.activityStartTime = this.formData.dateRange[0]; //活动开始时间
          Datas.activityEndTime = this.formData.dateRange[1]; //活动结束时间
          if (this.linkName !== "" || this.linkName !== null) {
            Datas.activityCreater = this.linkName; //活动创建人
          } else {
            Datas.activityCreater = this.userInfo.mobile; //活动创建人
          }
          Datas.activityCrowd = this.formData.activityCrowd; // 活动人群
          if (this.formData.activityCrowd == "2") {
            // 会员等级
            if (this.levelL.length === 0) {
              this.$message.error("请选择会员等级！");
              return false;
            }
            Datas.activityCrowdRue = [];
            Datas.activityCrowdRue = this.levelL.toString();
          } else if (this.formData.activityCrowd == "3") {
            // 自定义会员
            if (
              Number(this.formData.moneyMin) > Number(this.formData.moneyMax)
            ) {
              this.$message.error("自定义会员消费最低金额不能大于最高金额！");
              return false;
            }
            var arr = {};
            Datas.activityCrowdRue = {};
            arr.startDate = this.formData.orderDate[0];
            arr.endDate = this.formData.orderDate[1];
            arr.payNum = this.formData.payNum;
            arr.moneyMin = this.formData.moneyMin;
            arr.moneyMax = this.formData.moneyMax;
            arr.typeId = this.formData.typeId;
            arr.brandId = this.formData.brandId;
            arr.peopleNum = this.formData.peopleNum;
            Datas.activityCrowdRue = JSON.stringify(arr);
          } else {
            Datas.activityCrowdRue = "";
          }
          Datas.putChannel = JSON.stringify(this.formData.putChannel);
          Datas.activityType = "1";
          Datas.maxTimes = this.formData.maxTimes; //最大参与次数
          Datas.H5title = this.formData.H5title;
          Datas.urlId = this.formData.urlId; //h5链接地址
          Datas.receiveType = "1"; //领取规则：0-买家领取，1-卖家发放
          Datas.msgTemplateId = this.formData.msgTemplateId; //短信模版Id

          for (var i = 0; i < this.formData.shopList.length; i++) {
            this.formData.shopList[i].orgId = this.formData.shopList[i].id;
            this.formData.shopList[i].area = this.formData.shopList[i].region;
          }
          Datas.shopList = JSON.stringify(this.formData.shopList);
          for (var i = 0; i < this.formData.ticketList.length; i++) {
            this.formData.ticketList[i].ticketId = this.formData.ticketList[
              i
            ].id;
          }
          Datas.ticketList = JSON.stringify(this.formData.ticketList);
          if (util.getQuery().id !== undefined) {
            Datas.id = util.getQuery().id;
            updateActivity(Datas).then(res => {
              if (res.code == "200") {
                util.routerTo(
                  "/marketing-center/company-active/activity-query"
                );
              }
            });
          } else {
            saveOrUpdateActivity(Datas).then(res => {
              if (res.code == "200") {
                util.routerTo(
                  "/marketing-center/company-active/activity-query"
                );
              }
            });
          }
        } else {
          this.$message.error("请检查必填信息");
          return false;
        }
      });
    },
    //查询详情
    details(id) {
      let Datas = {
        id: util.getQuery().id
      };
      getActivityDetail(Datas).then(res => {
        this.formData = res.data;
        let dateArr = [];
        dateArr.push(util.getdatetime(this.formData.activityStartTime));
        dateArr.push(util.getdatetime(this.formData.activityEndTime));
        this.$set(this.formData, "dateRange", dateArr);
        if (res.data.activityCrowd == "0") {
          // 活动人群
          this.formData.activityCrowd = "0";
        } else if (res.data.activityCrowd == "2") {
          // 会员等级
          this.formData.activityCrowd = "2";
          this.memLevel = true;
          var activityArr = res.data.activityCrowdRue;
          var activityArrs = activityArr.split(",");
          this.levelL = activityArrs;
        } else if (res.data.activityCrowd == "3") {
          // 自定义会员
          this.formData.activityCrowd = "3";
          this.diymem = true;
          var activityCrowdRue = {};
          activityCrowdRue = JSON.parse(res.data.activityCrowdRue);
          let orderDateArr = [];
          orderDateArr.push(activityCrowdRue.timeStart);
          orderDateArr.push(activityCrowdRue.timeEnd);
          this.$set(this.formData, "orderDate", orderDateArr);
          this.formData.payNum = activityCrowdRue.payNum;
          this.formData.moneyMin = activityCrowdRue.moneyMin;
          this.formData.moneyMax = activityCrowdRue.moneyMax;
          this.$set(this.formData, "typeId", activityCrowdRue.typeId);
          this.$set(this.formData, "brandId", activityCrowdRue.brandId);
          this.formData.peopleNum = activityCrowdRue.peopleNum;
        }
        this.formData.putChannel = JSON.parse(res.data.putChannel);
        if (this.formData.putChannel.indexOf("1") != -1) {
          this.isH5Page = true;
        }
        this.formData.receiveType = this.formData.receiveType.toString();
      });
    }
  }
};
</script>

<style>
.activityPeople .el-radio {
  line-height: 2;
}
</style>

<style scoped>
.infon_text_t {
  margin-right: 10px;
}
.ts {
  color: #909399;
}
.sub {
  margin-top: 30px;
  width: 100%;
  text-align: center;
  margin-bottom: 100px;
}
.activityPeople .memLevelContent {
  margin: 10px 0;
  padding: 10px;
  background-color: #ffffff;
}
</style>
